class SkinSelectPanel extends eui.Component{
    public _stage = egret.MainContext.instance.stage;//舞台实例
    public dataManager:DataManager = DataManager.getInstance();
    private static instance;
    public skinBg:eui.Image;
    public scroller:eui.Scroller;
    public list : eui.List;
    public roles_component:eui.Group;
    public close_btn:eui.Image;
    public role :RoleDragonAni;
    public oxygen_label:eui.Label;
    public revival_label:eui.Label;
    public speed_label:eui.Label;
    public rolename_label:eui.Label;
    public des_label:eui.Label;
    public selectItemIndex;
    public gameUi:GameUi = GameUi.getInstance();
    public dataArray: eui.ArrayCollection = new eui.ArrayCollection();
    
    private constructor() {
        super();
        this.x = 0;
        this.skinName = "resource/eui_skins/SkinSelectPanel.exml";
        this.addRole();
        this.initSelected()
    }
    
    static getInstance(): SkinSelectPanel {
        return SkinSelectPanel.instance ? SkinSelectPanel.instance : SkinSelectPanel.instance = new SkinSelectPanel();
    }

    protected createChildren(): void {
        super.createChildren();
        
        this.list.dataProvider = this.dataArray;
        this.list.itemRenderer = ScrollerItem;
        this.dataArray.replaceAll(this.dataManager.skinList);

        this.list.addEventListener(eui.ItemTapEvent.ITEM_TAP, this.onItemTapHandler, this);
        this.scroller.addEventListener(egret.Event.CHANGE,this.moveScroller,this);
        this.close_btn.addEventListener(egret.TouchEvent.TOUCH_TAP,this.closePanel,this);
        this.roles_component.addEventListener(egret.TouchEvent.TOUCH_TAP,this.playAction,this);
        this.scroller.addEventListener(egret.Event.ADDED,this.initScale,this)
    }

    private playAction(){
        if(this.role.actionFlag>=this.role.actList.length){
            this.role.actionFlag = 0;
        }
        this.role.armature.animation.play(this.role.actList[this.role.actionFlag+1]);//启动骨骼动画播放
        this.role.actionFlag += 1;
    }

    /**
     * 关闭当前面板已经一些其他操作
     */
    private closePanel(){
        if(this.gameUi.role.armatureWrap.y>this.gameUi.levelHeight){
            if(this.gameUi.skinIsChange){
                this.gameUi.skin_cd();
                this.gameUi.role.yq.init()
            }else{
                if(!this.gameUi.role.yq.smTimer){
                    this.gameUi.role.yq.startTimer()
                }
            }
        }else{
            if(this.gameUi.skinIsChange){
                this.gameUi.skinIsChange = false;
            }
            this.gameUi.role.yq.init()
        }
        let circleTran = new CircleTran(375,200,()=>{
            this._stage.removeChild(this);
        });
        this._stage.addChildAt(circleTran,100);
    }

    /**
     * 初始化item的缩放
     */
    public initScale(){
        let sc = this.scroller;
        if(sc.viewport.$children.length>=5){                
            for(let i = 0;i<sc.viewport.$children.length;i++){
                let chaz = sc.height/2 -(sc.viewport.$children[i].y+sc.viewport.$children[i].height/2-sc.viewport.scrollV);
                if(Math.abs(chaz)<200 && Math.abs(chaz)>0){
                    if(chaz<0){
                        sc.viewport.$children[i].scaleY = 1.2+chaz/1000;
                        sc.viewport.$children[i].scaleX = 1.2+chaz/1000;
                    }else if(chaz>0){
                        sc.viewport.$children[i].scaleY = 1.2-chaz/1000;
                        sc.viewport.$children[i].scaleX = 1.2-chaz/1000;
                    }
                }else if(Math.abs(chaz)==0){
                    sc.viewport.$children[i].scaleX = 1.2;
                    sc.viewport.$children[i].scaleY = 1.2
                }else{
                    sc.viewport.$children[i].scaleX = 1;
                    sc.viewport.$children[i].scaleY = 1
                }
            }
            this.scroller.removeEventListener(egret.Event.ADDED,this.initScale,this)
        }
    }
    
    /**
     * 添加一个角色
     */
    private addRole(){
        let roleInfo = {
            x:100,
            y:140,
            skinId:this.dataManager.myConfig['currentSkin'],
            uid:this.dataManager.myConfig['uid'],
            name:this.dataManager.myConfig['name'],
            grade:this.dataManager.myConfig['grade']
        };
        this.role = new RoleDragonAni(this,roleInfo,0.5,false);
    }
    private moveScroller(e):void{
        //点击按钮后改变滚动的位置
        let sc = this.scroller;
        for(let i = 0;i<sc.viewport.$children.length;i++){
            let chaz = sc.height/2 -(sc.viewport.$children[i].y+sc.viewport.$children[i].height/2-sc.viewport.scrollV);
            if(Math.abs(chaz)<200 && Math.abs(chaz)>0){
                if(chaz<0){
                    sc.viewport.$children[i].scaleY = 1.2+chaz/1000;
                    sc.viewport.$children[i].scaleX = 1.2+chaz/1000;
                }else if(chaz>0){
                    sc.viewport.$children[i].scaleY = 1.2-chaz/1000;
                    sc.viewport.$children[i].scaleX = 1.2-chaz/1000;
                }
            }else if(Math.abs(chaz)==0){
                sc.viewport.$children[i].scaleX = 1.2
                sc.viewport.$children[i].scaleY = 1.2
            }else{
                sc.viewport.$children[i].scaleX = 1
                sc.viewport.$children[i].scaleY = 1
            }
        }
    }

    public selectedFlag :number = null
    public onItemTapHandler(e){
        console.log(e.itemIndex)
        for(let i = 0;i<this.list.$children.length;i++){
            //获取之前已经选中的那个item
            if(this.list.$children[i]['isSelect'].visible === true){
                this.selectedFlag = i;
            } 
            //获取当前点中的item
            if(e.itemIndex === this.list.$children[i]['itemIndex']){
                this.selectItemIndex = i
            }
        }
        //判断是否点击自己
        if(e.itemIndex === this.list.$children[this.selectedFlag]['itemIndex']){
            console.log("点击自己")
        }else{
            if(this.isHasSkin(this.list.$children[this.selectItemIndex]["data"].id)){
                this.list.$children[this.selectItemIndex]['isSelect'].visible = true;
                this.list.$children[this.selectedFlag]['isSelect'].visible = false;
            }
        }
    }

    /**
     * 当界面初始化的时候，设置当前角色的皮肤
     */
    public initSelected(){
        let skinList = this.dataManager.skinList;
        for(let i = 0;i<skinList.length;i++){
            if(this.dataManager.myConfig['currentSkin'] == skinList[i]['id']){
                this.oxygen_label.text =skinList[i]['oxygen']>=0?"氧气 +"+ skinList[i]['oxygen']:"氧气 "+ skinList[i]['oxygen'];
                this.revival_label.text =skinList[i]['revival']>=0?"复活 +"+ skinList[i]['revival']:"复活 "+ skinList[i]['revival'];
                this.speed_label.text =skinList[i]['speed']>=0?"游速 +"+ skinList[i]['speed']:"游速 "+ skinList[i]['speed'];
                this.des_label.text = skinList[i]['des'];
                this.rolename_label.text = skinList[i]['name'];
                let imgLoader = new egret.ImageLoader();
                imgLoader.crossOrigin = "anonymous";
                imgLoader.load(this.dataManager.skinBackRUrl+skinList[i]['backImg']+".jpg");
                imgLoader.once(egret.Event.COMPLETE, (evt: egret.Event)=> {
                    if (evt.currentTarget.data) {
                        let texture = new egret.Texture();
                        texture.bitmapData = evt.currentTarget.data;
                        this.skinBg.source = texture;
                    }
                }, this);
            }
        }
    }

    public isHasSkin(skinId){
        for(let i = 0;i<this.dataManager.myConfig['hadSkin'].length;i++){
            if(skinId == this.dataManager.myConfig['hadSkin'][i]){
                return true;
            }
        }
        return false;
    }

}